<template lang="html">
	<div class="classification_box">
		<Header :HeaderTitle="header_title"></Header>
		<ul class="box">
			<li class="title_header">
				<div class="backGo_title">
				    <p class="orderStatus">买家已付款</p>
				    <p class="orderMoney">订单金额：<span>¥{{detailsshuju.money}}</span></p>
				</div>
			</li>
			<li>
				<div class="address">
				    <p>
				        <span class="userName">{{detailsshuju.name}}</span>
				        <span class="phoneNum">{{detailsshuju.mobile}}</span>
				    </p>
				    <p class="add">{{detailsshuju.address}} </p>
				</div>
			</li>
			<li>
				<div class="shop">
				    <div class="shopName">
				        <span>竟优品</span>
				    </div>
				    <div class="goodsname_box">
			        	<img class="goods_img" :src="detailsshuju.goods_info.thumb" :alt="detailsshuju.goods_info.title"> 
			        	<p class="goodsname_main">{{detailsshuju.goods_info.title}}</p> 
			        	<p class="goods_pirce">¥{{detailsshuju.price}}</p> 
			        	<p class="goods_num">*{{detailsshuju.num}}</p>
				    </div>
				</div>
			</li>
			<li>
				<div class="merchandise">
				    <label>商品小计</label>
				    <span>¥{{detailsshuju.money}}</span>
				</div>
			</li>
			<li>
				<div class="orderNum">
				    <p><label>订单编号:</label><span>{{detailsshuju.ordername}}</span></p>
				    <p><label>创建时间:</label><span>{{detailsshuju.create_time}}</span></p>
				    <p><label>支付时间:</label><span>{{detailsshuju.pay_time}}</span></p>
				    <p><label>竞猜时间:</label><span>{{detailsshuju.guess_time}}</span></p>
				    <p><label>发货时间:</label><span>{{detailsshuju.fahuo_time}}</span></p>
				    <p><label>收货时间:</label><span>{{detailsshuju.shouhuo_time}}</span></p>
				</div>
			</li>
		</ul>
	</div>
</template>
<script type="text/javascript">
	import Header from "../header/header.vue";
	export default {
	  data(){
	  	return{
	  		header_title:{url:"/",title:"订单详情"},
	  		detailsshuju:{}
	  	}
	  },
	  methods:{
	    orderdetailsshuju:(argument)=>{
	    	let boxmain = argument,
	    	cur_id = sessionStorage.getItem("cur_id"),
      		sign = sessionStorage.getItem("sign"),
	    	orderid=boxmain.$route.query.id,
	    	type=boxmain.$route.query.type,
	    	_url = "/index.php?g=app&m=shopping&a=myorder_one_post",
	    	_data = {
	    		cur_id:cur_id,
	    		sign:sign,
	    		id:orderid,
	    		type:type
	    	}
	    	boxmain.$http.post(_url,_data).then(function(data){
	          if(data.data.status== "1"){
	          	boxmain.detailsshuju = data.data.data.order_info
	          }else {
	            
	          }
	      },function(response){
	          boxmain.$toast(response);
	      })
	    }
	  },
	  created:function(){
	    let conent = this;
	    conent.orderdetailsshuju(conent);
	  },
	  components:{
	  	'Header':Header
	  }
	}
</script>
<style type="text/css" lang="less">
@import '../../../assets/less/index.less';
.classification_box{
	.box{
		width: 100vw;
		border-top: solid 1px @color8;
		text-align: left;
		font-size: @h3_font_size;
		li{
			width: 100vw;
			margin-top: 3vw;
			border: solid 1px @color8;
			.backGo_title,.address,.shop,.merchandise,.orderNum{
				width: @width;
				margin: 0 auto;
			}
		}
		.title_header{
			background-color: @color11;
		}
		.backGo_title{
			color: @color1;
			padding: 3vw 0vw;
			.orderStatus{
				font-size: @h1_font_size;
				font-weight: 800;
				line-height: 6vw;
			}
			.orderMoney{
				font-size: @h3_font_size;
				line-height: 6vw;
			}
		}
		.address{
			line-height: 6vw;
			padding: 3vw 0vw;
		}
		.shop{
			.shopName{
				line-height: 8vw;
				border-bottom: solid 1px @color8;
			}
			.commodity{
				padding: 3vw 0;
				img{
					width: 13.6vw;
					height: 13.6vw;
				}
				.price{

				}
				.size{}
			}
		}
		.merchandise{
			line-height: 8vw;
		}
		.goodsname_box{
	  		width: @width;
	  		height: 18vw;
	  		margin: 3vw auto;
	  		font-size: @h3_font_size; 
	  		.goods_img,.goodsname_main{
	  			float: left;
	  		}
	  		.goods_img{
	  			width: 18vw;
	  			height: 18vw;
	  		}
	  		.goodsname_main{
	  			width:45vw;
	  			margin-left: 2vw;
	  		}
	  		.goods_pirce,.goods_num{
	  			float: right;
	  			text-align: right;
	  			width: 21vw;
	  		}
	  		.goods_pirce{
	  			color: @color;
	  		}
	  		.goods_num{
	  			margin-top: 3vw;
	  		}
	  	}
		.orderNum{
			line-height: 6vw;
			padding: 2vw 0;
			label{
				color: @color3;
			}
			span{}
		}
	}
}
</style>